<template>
	<div>
		<el-card class="box-card" > 
			<div slot="header" class="clearfix">
				<span>订单列表</span>
			</div>
			<el-table :data="tableData" style="width: 100%" >
				<el-table-column prop="id" label="#"  width="50px">
				</el-table-column>
				<el-table-column prop="goodsList" label="" width="600px">
					<template slot-scope='scope'>
						<el-table :data="scope.row.goodsList" style="width: 100%">
						<el-table-column prop="img_md" label="商品" width='100px'>
							<template slot-scope='scope'>
								<img :src="scope.row.img_md" width='80' height='80'>
							</template>
						</el-table-column>
						<el-table-column prop="name" label="" width='300px'>
						</el-table-column>
						<el-table-column prop="goods_price" label="单价" sortable>
						</el-table-column>	
							<el-table-column prop="goods_num" label="数量" sortable>
							</el-table-column>
							</el-table>
					</template>
				</el-table-column>
				<el-table-column prop="payment" label="付款总额">
				</el-table-column>
				<el-table-column prop="create_time" label="下单时间" width='200px' sortable>
				</el-table-column>
				<el-table-column prop="status" label="状态" sortable width='150px'>
				</el-table-column>
				<el-table-column label="操作" width="120px">
					<template slot-scope='scope'>
						<router-link :to="{name:'ArticleEdit',params:{id:scope.row.id}}">
							<el-button size="mini" type="primary" icon="el-icon-edit" plain></el-button>
						</router-link>
					</template>
				</el-table-column>
			</el-table>
			
		</el-card>

	</div>
</template>

<script>
	import { Order,Goods} from '@/api/';
	export default {
		data() {
			return {
				tableData: [],
		
				form:{
				pageSize: '', 
				pageIndex: '',	
				},
			}
		},
		created() {
			this.loadList();
		},
		methods: {
			async loadList() {
				let { status, data,msg } = await Order.list({ status:'all'});
				if (status) {
					this.tableData = data;
				}
			},
			// async loadList() {
			// 	let { status, goods, total } = await Goods.list({ pageSize: '6', pageIndex: '1' });
			// 	console.log(Goods.list({ pageSize: '6', pageIndex: '1' }))
			// 	if (status) {
			// 		this.tableData = goods;
			// 	}
			// },
			// handleRemove(id, i) {
			// 	this.$confirm('此操作将永久删除商品，是否继续', { type: 'warning' })
			// 		.then(async () => {
			// 			//ajax
			// 			let { status, msg } = await Goods.remove(id);

			// 			if (status) {
			// 				// 跟新DOM
			// 				this.tableData.splice(i, 1);
			// 				this.$message.success('删除成功');
			// 			}
			// 		})
			// 		.catch(() => {
			// 			this.$message.info('取消成功')
			// 		})
			// },
	
		},
	}
</script>

<style lang="less" scoped>
.page{
	padding-top: 15px;
	display: flex;
	justify-content: flex-end;
}
</style>
